<%@page import="java.sql.ResultSet, java.text.*"%>
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<jsp:useBean id="bt" class="store.book.javabean.Books_Table"></jsp:useBean>
<jsp:useBean id="ubbt" class="store.book.javabean.User_Buy_Books_Table"></jsp:useBean>
<%
	String admin_email = (String) session.getAttribute("admin_email");
	if (admin_email != null) {
		//如果管理员访问此页就跳转到index.jsp，因为管理员不需要用到此页。
		response.sendRedirect("index.jsp");
	} else {
		String bookid = request.getParameter("currentItem");
		//不允许用户非法访问本页（不携带currentItem参数）
		if (bookid == null) {
			response.sendRedirect("index.jsp");
		} else {
			session.setAttribute("currentItem", bookid);
			try {
				long bookidNum = Long.parseLong(bookid);
				bt.setBook_id(bookidNum);
				ResultSet rs = bt.getBooksInfoById(bt);
%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>购物 - BookStore</title>
<!-- 引入 Bootstrap -->
<link href='css/bootstrap.min.css' rel="stylesheet">
<link href="css/bootstrap-theme.min.css" rel="stylesheet" />
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />
<!-- jQuery (Bootstrap 的 JavaScript 插件需要引入 jQuery) -->
<script src="js/jquery-3.1.1.min.js"></script>
<!-- 包括所有已编译的插件 -->
<script src="js/bootstrap.min.js"></script>
<!--Bootstrap Star Rating-->
<link href="css/star-rating.min.css" media="all" rel="stylesheet"
	type="text/css" />
<script src="js/star-rating.js" type="text/javascript"></script>
<!-- HTML5 Shim 和 Respond.js 用于让 IE8 支持 HTML5元素和媒体查询 -->
<!-- 注意： 如果通过 file://  引入 Respond.js 文件，则该文件无法起效果 -->
<!--[if lt IE 9]>
        	<script src="js/html5shiv.min.js"></script>
        	<script src="js/respond.min.js"></script>
    	<![endif]-->
<style>
body {
	background-color: #F1F1F1;
}

#div1 {
	position: relative;
}

#div1 img {
	width: 100%;
	height: 100%;
}

#div1 span {
	width: 195px;
	height: 195px;
	background: #0088cc;
	left: 0px;
	top: 0px;
	position: absolute;
	display: none;
	filter: alpha(opacity :       20);
	opacity: 0.2;
}

.show {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 10px;
	filter: alpha(opacity :       10);
	opacity: 0.1;
	left: 0;
	top: 0;
}

#div2 {
	position: relative;
	display: none;
	overflow: hidden;
}

#img1 {
	position: absolute;
}

.But {
	height: 40px;
}

.But span {
	font-size: 20px;
	top: 10px;
	margin-left: 10px;
}

#message {
	height: 90px;
}

.submit {
	margin-top: 5px;
}
</style>
</head>
<body>
	<div class="container" id="item">
		<div class="row">
			<h1></h1>
		</div>

		<div class="row">
			<div class="col-md-2 col-lg-2"></div>
			<div id="div1" class="col-md-4 col-lg-4 thumbnail">
				<img src='images/Books/<%=bookid%>.jpg' /> <span></span>
				<div class="show"></div>
			</div>

			<div id="div2" class="col-md-4 col-lg-4">
				<img id="img1" src='images/Books/<%=bookid%>.jpg' />
			</div>

			<div id="div3" class="col-md-4 col-lg-4 thumbnail"
				style="line-height: 30px; overflow: auto;">
				<img src="images/Books/20161023212359.jpg"
					style="visibility: hidden; position: relative; z-index: -1;" />
				<div style="position: absolute; top: 25px; left: 10px">
					<div>
						<%
							while (rs.next()) {
						%>
						<span class="text-muted">书名：</span><strong id="bookname"><%=rs.getString("book_name")%></strong><br />
						<span class="text-muted">作者：</span><span class="text-info"
							id="author"><%=rs.getString("book_author")%></span><br /> <span
							class="text-muted">单价：</span><span class="text-danger">¥</span><span
							class="text-danger" id="unitpriceTool"><fmt:formatNumber
								value='<%=rs.getDouble("book_price")%>' pattern="0.00"></fmt:formatNumber>
						</span><br />
						<span class="text-muted"
							style="float: left; margin-top: 7px;">评分：</span>
							<input id="input-2b" type="number" class="rating" min="0" max="5" value="<fmt:formatNumber value='<%=rs.getDouble("book_grade")%>' pattern='0.0'></fmt:formatNumber>"
							step="0.5" data-size="xs" data-symbol="&#xe005;"
							data-default-caption="{rating}" data-star-captions="{}">
						<div class="clearfix"></div>
						<span class="text-muted">已选：</span><span class="text-success"
							id="amountTool">1</span><span class="text-success">件</span>
						&nbsp;&nbsp;<span class="text-muted">总价：</span><span
							class="text-success">¥</span><span class="text-success"
							id="totalTool"><fmt:formatNumber
								value='<%=rs.getDouble("book_price")%>' pattern="0.00"></fmt:formatNumber>
						</span>
						<%
							}
									} catch (Exception e) {
									}
						%>
						<br /> <span class="text-muted" style="float: left;">数量：</span>
					</div>
					<jsp:include page="unit/numSelectTool.html"></jsp:include>
					<div style="margin-top: 20px;">
						<button type="submit" class="btn btn-success" id="immediatelyBuy">立即购买</button>
						<button type="submit" class="btn btn-primary" id="joinCart">加入购物车</button>
						<%
							String user_email = (String) session
											.getAttribute("user_email");
									if (user_email == null) {//没有登录，跳转到登录页登录
						%>
						<script type="text/javascript">
						var immediatelyBuy = document.getElementById('immediatelyBuy');
						var joinCart = document.getElementById('joinCart');						
						
						$('#input-2b').parent().click(function() {
							location.href = "login.jsp?" + "itemtologin=" + encodeURI("itemtologin");
						});
						
						immediatelyBuy.onclick = function() {
							location.href = "login.jsp?" + "itemtologin=" + encodeURI("itemtologin");
						};
						joinCart.onclick = function() {
							location.href = "login.jsp?" + "itemtologin=" + encodeURI("itemtologin");
						};
					</script>
						<%
							} else {//若用户已经登录，则执行相应功能
						%>
						<script type="text/javascript">
						$('#input-2b').parent().click(function() {
							var input = $('#input-2b').val();
							location.href = "servlet/UserComment?" + "grade=" + input + '&bookid=<%=bookid%>';
						});
						
						immediatelyBuy.onclick = function() {
							var amount = document.getElementById('amountTool');
							location.href = "trade.jsp?" + 'bookid=<%=bookid%>&booknum='+amount.textContent;
						};
						joinCart.onclick = function() {
							var amount = document.getElementById('amountTool');
							location.href = "cart.jsp?" + 'bookid=<%=bookid%>&booknum='+ amount.textContent;
						};
						</script>
						<%
							}
						%>
					</div>
				</div>
				<div class="col-md-2 col-lg-2"></div>
			</div>
		</div>

		<div class="row">
			<div class="col-md-2 col-lg-2"></div>

			<div class="col-md-8 col-lg-8 thumbnail">
				<div id="sendMsg" role="form">
					<p class="text-info" style="margin-left: 10px; margin-top:4px; margin-bottom:4px; font-size: 21px;">
						<span class="glyphicon glyphicon-comment"></span>
						<strong><em>评论</em> </strong>
					</p>
					<form action="servlet/UserComment" method="post">
					<div class="form-control" id="message" contentEditable='true'></div>
					<div class="But">
						<span class="glyphicon glyphicon-thumbs-up bq pull-left"
							data-toggle="popover" data-placement="bottom" id="popoverThumbs"></span>
						<input style="display: none;" type="text" id="commentcontent" name="commentcontent" value="" />
						<button type="submit" id="publishComment" name="bookid" value='<%=bookid%>' class="btn btn-primary submit pull-right submit">发表</button>
						
						<%
							String comment_user = (String) session.getAttribute("user_email");
							if (comment_user == null) {
								//若没有登录点击发表按钮，就跳转到登录页登录
						%>
						<script type="text/javascript">
							var publishComment = document.getElementById('publishComment');
							
							publishComment.onclick = function() {
								location.href = "login.jsp?" + "itemtologin=" + encodeURI("itemtologin");
								return false;
							};
						</script>
						<%
							} else {
								//用户已登录，可以发表
						%>
						<script type="text/javascript">
							publishComment.onclick = function() {
								var txt = $('#message').html();
							
								if (txt.trim() == "") {
									$('#message').focus();//自动获取焦点
									return false;
								} else {
									$('#commentcontent').val(txt);
									//location.href = "servlet/UserComment?" + "commentcontent=" + encodeURI(txt) + '&bookid=<%=bookid%>';
									return true;
								}
							};
						</script>
						<%	
							}
						%>
						
						<!--face begin-->
						<div class="face" style="display: none;">
							<ul class="list-inline">
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/zz2_thumb.gif" title="[织]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/horse2_thumb.gif" title="神马]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/fuyun_thumb.gif" title="[浮云]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/geili_thumb.gif" title="[给力]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/wg_thumb.gif" title="[围观]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/vw_thumb.gif" title="[威武]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/panda_thumb.gif" title="[熊猫]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/rabbit_thumb.gif" title="兔子]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/otm_thumb.gif" title="[奥特曼]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/j_thumb.gif" title="[囧]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/hufen_thumb.gif" title="[互粉]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/liwu_thumb.gif" title="[礼物]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/smilea_thumb.gif" title="呵呵]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/tootha_thumb.gif" title="嘻嘻]"></li>
							</ul>
							<ul class="list-inline">
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/laugh.gif" title="[哈哈]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/tza_thumb.gif" title="[可爱]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/kl_thumb.gif" title="[可怜]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/kbsa_thumb.gif" title="[挖鼻屎]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/cj_thumb.gif" title="[吃惊]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/shamea_thumb.gif" title="[害羞]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/zy_thumb.gif" title="[挤眼]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/bz_thumb.gif" title="[闭嘴]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/bs2_thumb.gif" title="[鄙视]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/lovea_thumb.gif" title="[爱你]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/sada_thumb.gif" title="[泪]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/heia_thumb.gif" title="[偷笑]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/qq_thumb.gif" title="[亲亲]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/sb_thumb.gif" title="[生病]"></li>
							</ul>
							<ul class="list-inline">
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/mb_thumb.gif" title="[太开心]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/ldln_thumb.gif" title="[懒得理你]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/yhh_thumb.gif" title="[右哼哼]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/zhh_thumb.gif" title="[左哼哼]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/x_thumb.gif" title="[嘘]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/cry.gif" title="[衰]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/wq_thumb.gif" title="[委屈]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/t_thumb.gif" title="[吐]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/k_thumb.gif" title="[打哈气]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/bba_thumb.gif" title="[抱抱]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/angrya_thumb.gif" title="[怒]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/yw_thumb.gif" title="[疑问]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/cza_thumb.gif" title="[馋嘴]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/88_thumb.gif" title="[拜拜]"></li>
							</ul>
							<ul class="list-inline">
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/sk_thumb.gif" title="[思考]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/sweata_thumb.gif" title="[汗]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/sleepya_thumb.gif" title="[困]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/sleepa_thumb.gif" title="[睡觉]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/money_thumb.gif" title="[钱]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/sw_thumb.gif" title="[失望]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/cool_thumb.gif" title="[酷]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/hsa_thumb.gif" title="[花心]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/hatea_thumb.gif" title="[哼]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/gza_thumb.gif" title="[鼓掌]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/dizzya_thumb.gif" title="[晕]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/bs_thumb.gif" title="[悲伤]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/crazya_thumb.gif" title="[抓狂]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/h_thumb.gif" title="[黑线]"></li>
							</ul>
							<ul class="list-inline">
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/yx_thumb.gif" title="[阴险]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/nm_thumb.gif" title="[怒骂]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/hearta_thumb.gif" title="[心]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/unheart.gif" title="[伤心]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/pig.gif" title="[猪头]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/ok_thumb.gif" title="[ok]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/ye_thumb.gif" title="[耶]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/good_thumb.gif" title="[good]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/no_thumb.gif" title="[不要]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/z2_thumb.gif" title="[赞]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/come_thumb.gif" title="[来]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/sad_thumb.gif" title="[弱]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/lazu_thumb.gif" title="[蜡烛]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/clock_thumb.gif" title="[钟]"></li>
							</ul>
							<ul class="list-inline">
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/cake.gif" title="[蛋糕]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/m_thumb.gif" title="[话筒]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/weijin_thumb.gif" title="[围脖]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/lxhzhuanfa_thumb.gif" title="[转发]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/lxhluguo_thumb.gif" title="[路过这儿]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/bofubianlian_thumb.gif" title="[bofu变脸]">
								</li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/gbzkun_thumb.gif" title="[gbz困]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/boboshengmenqi_thumb.gif" title="[生闷气]">
								</li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/chn_buyaoya_thumb.gif" title="[不要啊]">
								</li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/daxiongleibenxiong_thumb.gif" title="[dx泪奔]">
								</li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/cat_yunqizhong_thumb.gif" title="[运气中]">
								</li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/youqian_thumb.gif" title="[有钱]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/cf_thumb.gif" title="[冲锋]"></li>
								<li onclick="thumbsClick(this)"><img
									src="images/thumbs/camera_thumb.gif" title="[照相机]"></li>
							</ul>
						</div>
						<!--face end-->
					</div>
					</form>
				</div>
			</div>

			<div class="col-md-2 col-lg-2"></div>
		</div>

		<div id="time1"></div>
		<!--msgCon begin-->
		<div id="msgCon">
			<%
				ubbt.setBook_id(Long.parseLong(bookid));
				ResultSet rsComment = ubbt.showAllComment(ubbt);
				while (rsComment.next()) {
					if (rsComment.getString("user_comment") != null) {
						if (!rsComment.getString("user_comment").trim().isEmpty()) {
			%>
			<div class='row'>
				<div class='col-md-2 col-lg-2'></div>
				<div class='panel panel-default col-md-8 col-lg-8 thumbnail msgBox'>
					<div class='panel-heading'>
						<img class='user-photo pull-left' src='images/anonymous.png' style='width:30px; height:30px; margin-top: -4px;' />
						<p class='user-name pull-left' style='margin-left: 10px;'><strong id="email"><%=rsComment.getString("user_email")%></strong></p><br/>
						<span class='glyphicon glyphicon-thumbs-up pull-right' style='margin-top:-19px;' id="praise"></span>
						<span style="margin-top:-20px;" class="pull-right" id="commend"><%=rsComment.getInt("commend")%></span>
					</div>
					<div class='panel-body msgTxt'>
						<p><%=rsComment.getString("user_comment")%></p>
						<p class='comment-time pull-right text-muted' style="margin-bottom: -10px;">发表于：
						<%
							SimpleDateFormat timeFormat = new SimpleDateFormat("yyyy-MM-dd HH:mm");
							String publishTime = timeFormat.format(timeFormat.parse(rsComment.getTimestamp("comment_time").toString()));
							out.println(publishTime);
						%>
						</p>
					</div>
				</div>
				<div class='col-md-2 col-lg-2'></div>
			</div>
			<%
						}
					}
				}
			%>
		</div>
	</div>
	
	
	<%
		String commend_user = (String) session.getAttribute("user_email");
		if (commend_user == null) {
			//没有登录，不能点赞
	%>
	<script type="text/javascript">
		$('#praise').click(function() {
			location.href = "login.jsp?" + "itemtologin=" + encodeURI("itemtologin");
		});
	</script>
	<%
		} else {
			//已登录，可以点赞
	%>
	<script type="text/javascript">
		$('#praise').click(function() {
			var comment_user = $('#email').text();
			location.href = "servlet/UserComment?" + "commend=commend" + "&comment_user=" + comment_user + '&bookid=<%=bookid%>';
		});
	</script>
	<%
		}
	%>

	<!--js图片放大效果-->
	<script type="text/javascript">
		window.onload = function() {
			var oDiv = document.getElementById('div1');
			var oDiv2 = document.getElementById('div2');
			var oShow = oDiv.getElementsByTagName('div')[0];
			var oSpan = oDiv.getElementsByTagName('span')[0];
			var oImg = document.getElementById('img1');
			oShow.onmouseover = function() {
				var w = $(window).width();
				if (w > 992) {
					var h = oDiv.offsetHeight;
					oDiv2.setAttribute("style", "height: " + h + "px;");
					oSpan.style.display = "block";
					oImg.parentNode.style.display = "block";
					document.getElementById('div3').style.display = "none";
				}
			};

			oShow.onmouseout = function() {
				var w = $(window).width();
				if (w > 992) {
					oSpan.style.display = "none";
					oImg.parentNode.style.display = "none";
					document.getElementById('div3').style.display = "block";
				}
			};

			oShow.onmousemove = function(ev) {
				var w = $(window).width();
				if (w > 992) {
					var oEvent = ev || event;
					var x = oEvent.clientX - oDiv.offsetLeft
							- oSpan.offsetWidth / 2;
					var y = oEvent.clientY - oDiv.offsetTop
							- oSpan.offsetHeight / 2;
					if (x < 0) {
						x = 0;
					} else if (x > oShow.offsetWidth - oSpan.offsetWidth) {
						x = oShow.offsetWidth - oSpan.offsetWidth;
					}

					if (y < 0) {
						y = 0;
					} else if (y > oShow.offsetHeight - oSpan.offsetHeight) {
						y = oShow.offsetHeight - oSpan.offsetHeight;
					}

					oSpan.style.left = x + "px";
					oSpan.style.top = y + "px";
					var percentX = x / (oShow.offsetWidth - oSpan.offsetWidth);
					var percentY = y
							/ (oShow.offsetHeight - oSpan.offsetHeight);
					var oImgparent = oImg.parentNode;
					oImg.style.left = -percentX
							* (oImg.offsetWidth - oImgparent.offsetWidth)
							+ "px";
					oImg.style.top = -percentY
							* (oImg.offsetHeight - oImgparent.offsetHeight)
							+ "px";
				}
			};
		};
	</script>
	<script>
		$(document).ready(function() {
			$('#input-2b').rating();
		});
	
		//jQuery(document).ready(function() {
			//$(".rating-kv").rating();
		//});
		
		$(function() {
			$("[data-toggle='popover']").popover({
				html : true
			});
		});
	</script>
	<script type="text/javascript">
		//点击小图片，显示表情
		$("#popoverThumbs").click(function(e) {
			var thumbsHtml = $(".face").html();
			$(this).attr("data-content", thumbsHtml);
			e.stopPropagation(); //阻止冒泡事件
		});

		//在桌面任意地方点击，他是关闭
		$('body').on(
				'click',
				function(event) {
					var target = $(event.target);

					if (!target.hasClass('popover')
							&& target.parent('.popover-content').length === 0
							&& target.parent('.myPopover').length === 0
							&& target.parent('.popover-title').length === 0
							&& target.parent('.popover').length === 0
							&& target.attr("id") !== "folder") {
						$('#popoverThumbs').popover('hide');
					}
				});

		//点击小图标时，添加功能
		function thumbsClick(self) {
			var thumbsImg = self.firstChild.src.split("BookStore/")[1];
			var oImg = document.createElement("img");
			oImg.src = thumbsImg;
			document.getElementById('message').appendChild(oImg);
		}
		
		//当赞的数量大于0就将它设为红色
		$(function() {
			var width = $('#commend').width();
			$('#praise').css("margin-right", width);
		
			if (parseInt($('#commend').text()) > 0) {
				$('#praise').css("color", "red");
				$('#commend').css("color", "red");	
			}
		});
	</script>
</body>
</html>
<%
	}
	}
%>